<template>
	<div>
		<div class="tabNav">
			<router-link to="/index">
                <img src="../assets/img/sidebar1.png" />首页
            </router-link>
			<router-link to="/business">
				<b class="colors">/<img src="../assets/img/sidebar3.png" />企业信息</b>
            </router-link>
			<b>/<i style="font-size: 16px;margin-right: 5px;" class="el-icon-s-order"></i>企业信息详情</b>
			<!-- <el-input placeholder="请输入灵活用工平台名称进行搜索" suffix-icon="el-icon-search" v-model="input1">
			</el-input> -->
			<em v-if="Object.keys(infoObject).length > 0" style="margin-left: -5px;">{{ infoObject.name }}</em>
		</div>
		<el-row :gutter="24" style="margin-bottom: 20px">
			<el-col :span="24">
				<el-card shadow="hover" :body-style="{ padding: '0px' }">
					<div class="pad-loader" v-if="Object.keys(infoObject).length == 0">
						<content-loader :width="710" :height="300" :speed="3" primaryColor="#f3f3f3" secondaryColor="#ecebeb">
							<rect x="98" y="20" rx="6" ry="6" width="300" height="10" />
							<rect x="98" y="50" rx="6" ry="6" width="352" height="10" />
							<rect x="0" y="100" rx="6" ry="6" width="710" height="10" />
							<rect x="0" y="130" rx="6" ry="6" width="680" height="10" />
							<rect x="0" y="160" rx="6" ry="6" width="478" height="10" />
							<circle cx="40" cy="40" r="40" />
						</content-loader>
					</div>
					<div v-else>
						<div class="cardTit">基本信息</div>
						<div class="details-table">
							<el-row>
								<el-col :span="4">
									<div class="box-col col-title">企业类型</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content">{{ $store.state.companyType[infoObject.businessType] }}</div>
								</el-col>
								<el-col :span="4">
									<div class="box-col col-title">所属行业</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content">{{ $store.state.industry[infoObject.industyCode] }}</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="4">
									<div class="box-col col-title">社会统一信用代码</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content">{{ infoObject.socialCreditCode }}</div>
								</el-col>
								<el-col :span="4">
									<div class="box-col col-title">联系人姓名</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content">{{ infoObject.linkManName }}</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="4">
									<div class="box-col col-title">联系人身份证号</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content">{{ infoObject.linkManIdcard }}</div>
								</el-col>
								<el-col :span="4">
									<div class="box-col col-title"></div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content"></div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="4">
									<div class="box-col col-title img-height">联系人身份证正面照片</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content img-height">
										<span v-if="infoObject.linkIdcardFrondUrl == null || infoObject.linkIdcardFrondUrl == ''">-</span>
										<el-image
											v-else
											style="width: 160px; height: 80px"
											:src="infoObject.linkIdcardFrondUrl"
											:preview-src-list="[infoObject.linkIdcardFrondUrl]">
										</el-image>
									</div>
								</el-col>
								<el-col :span="4">
									<div class="box-col col-title img-height">联系人身份证反面照片</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content img-height">
										<span v-if="infoObject.linkIdcardBackUrl == null || infoObject.linkIdcardBackUrl == ''">-</span>
										<el-image
											v-else
											style="width: 160px; height: 80px"
											:src="infoObject.linkIdcardBackUrl"
											:preview-src-list="[infoObject.linkIdcardBackUrl]">
										</el-image>
									</div>
								</el-col>
							</el-row>
							<el-row>
									<el-col :span="4">
									<div class="box-col col-title">法人姓名</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content">
										<template v-if="infoObject.legalName == null">--</template>
										<template v-else>{{infoObject.legalName}}</template>
									</div>
								</el-col>
								<el-col :span="4">
									<div class="box-col col-title">法人身份证号</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content">
										<template v-if="infoObject.legalIdcard == null">--</template>
										<template v-else>{{infoObject.legalIdcard}}</template>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="4">
									<div class="box-col col-title img-height">法人身份证正面照片</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content img-height">
										<span v-if="infoObject.legalIdcardFrondUrl == null || infoObject.legalIdcardFrondUrl == ''">-</span>
										<el-image
											v-else
											style="width: 160px; height: 80px"
											:src="infoObject.legalIdcardFrondUrl"
											:preview-src-list="[infoObject.legalIdcardFrondUrl]">
										</el-image>
									</div>
								</el-col>
								<el-col :span="4">
									<div class="box-col col-title img-height">法人身份证反面照片</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content img-height">
										<span v-if="infoObject.legalIdcardBackUrl == null || infoObject.legalIdcardBackUrl == ''">-</span>
										<el-image
											v-else
											style="width: 160px; height: 80px"
											:src="infoObject.legalIdcardBackUrl"
											:preview-src-list="[infoObject.legalIdcardBackUrl]">
										</el-image>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="4">
									<div class="box-col col-title img-height">营业执照</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content img-height">
										<span v-if="infoObject.licenseUrl == null || infoObject.licenseUrl == ''">-</span>
										<el-image
											v-else
											style="width: 160px; height: 80px"
											:src="infoObject.licenseUrl"
											:preview-src-list="[infoObject.licenseUrl]">
										</el-image>
									</div>
								</el-col>
								<el-col :span="4">
									<div class="box-col col-title img-height">企业logo</div>
								</el-col>
								<el-col :span="8">
									<div class="box-col col-content img-height">
										<span v-if="infoObject.logoUrl == null || infoObject.logoUrl == ''">-</span>
										<el-image
											v-else
											style="width: 160px; height: 80px"
											:src="infoObject.logoUrl"
											:preview-src-list="[infoObject.logoUrl]">
										</el-image>
									</div>
								</el-col>
							</el-row>
							<el-row>
								<el-col :span="4">
									<div class="box-col col-title">资质附件</div>
								</el-col>
								<el-col :span="8">
									<div v-if="infoObject.qualAttachmentUrl != null && infoObject.qualAttachmentUrl != ''" class="box-col col-content">
										<a style="color:#326CF0;cursor:pointer" @click="openImgUrl(infoObject.qualAttachmentUrl)">点击查看</a>
									</div>
									<div v-else class="box-col col-content">
										-
									</div>
								</el-col>
								<el-col :span="4">
									<div class="box-col col-title">业务合作协议</div>
								</el-col>
								<el-col :span="8">
									<div v-if="infoObject.agreementUrl != null && infoObject.agreementUrl != ''" class="box-col col-content">
										<a style="color:#326CF0;cursor:pointer" @click="openUrl(infoObject.agreementUrl)">点击查看</a>
									</div>
									<div v-else class="box-col col-content">
										-
									</div>
								</el-col>
							</el-row>
						</div>
					</div>
				</el-card>
			</el-col>
		</el-row>
		<el-row :gutter="24">
			<el-col :span="24">
				<el-card class="cardTits cardTitss cardTitee" shadow="hover">
					<div class="cardTit">任务信息
						<router-link to="/assignment">
							<b>更多<i class="el-icon-arrow-right"></i></b>
						</router-link>
						<em v-if="Object.keys(taskCountObj).length > 0"><i style="font-size: 16px;margin-right: 5px;"
								class="el-icon-s-data"></i><span>发布任务总数量：{{ taskCountObj.taskNum }}</span>
								<span>进行中任务：{{ taskCountObj.hanldingTaskNum }}</span>
								<span>发布中任务：{{ taskCountObj.devlopingTaskNum }}</span><span
								style="border: 0">已结束任务：{{ taskCountObj.finishedTaskNum }}</span></em>
					</div>
					<v-tasktable :bussinessId="$route.query.id"></v-tasktable>
				</el-card>
			</el-col>
		</el-row>
		<el-row :gutter="24">
			<el-col :span="24">
				<el-card class="cardTits cardTitss cardTitee" shadow="hover">
					<div class="cardTit">结算信息
						<router-link to="/settlement">
							<b>更多<i class="el-icon-arrow-right"></i></b>
						</router-link>
						<em><i style="font-size: 16px;margin-right: 5px;" class="el-icon-s-data"></i><span
								style="border: 0">结算数量：{{ settleCountNum }}</span></em>
					</div>
					<settlement-table :bussinessId="$route.query.id"></settlement-table>
				</el-card>
			</el-col>
		</el-row>
		<el-row :gutter="24">
			<el-col :span="24">
				<el-card class="cardTits cardTitss cardTitee" shadow="hover">
					<div class="cardTit">发票信息
						<router-link to="/invoice">
							<b>更多<i class="el-icon-arrow-right"></i></b>
						</router-link>
						<em><i style="font-size: 16px;margin-right: 5px;" class="el-icon-s-data"></i><span
								style="border: 0">发票总数量：{{ invoiceCountNum }}</span></em>
					</div>
					<invoice-table :bussinessId="$route.query.id" :invoiceType="1"></invoice-table>
				</el-card>
			</el-col>
		</el-row>

	</div>
</template>

<script>
	// 任务信息
	import vTasktable from '../components/table/Tasktable.vue'
	// 结算信息
	import SettlementTable from '../components/table/SettlementTable.vue'
	// 发票信息
	import InvoiceTable from '../components/table/InvoiceTable.vue'
	// 内容占位符
	import {
		ContentLoader
	} from 'vue-content-loader'
	export default {
		name: "dashboard",
		data() {
			return {
				input1: '',
				infoObject: {},
				taskCountObj: {},
				settleCountNum: 0,
				invoiceCountNum: 0
			}
		},
		components: {
			vTasktable,
			SettlementTable,
			InvoiceTable,
			ContentLoader
		},
		computed: {
			role() {
				return this.name === "admin" ? "超级管理员" : "普通用户";
			}
		},
		mounted() {
			this.getInfoDel()
			this.getTaskCount()
			this.getSettleNum()
			this.getInvoiceCount()
		},
		methods: {
			getInfoDel() {
				// 获取企业详情信息
				this.$http({
					url: '/api/business/selectBusinessByPrimaryKey?businessId=' + this.$route.query.id,
					method: 'post',
					headers: {
						'Content-Type': 'application/json'
					}
				}).then(data => {
					if (data.code === 0) {
						console.log(data.result)
						this.infoObject = data.result
					}
				})
			},
			openImgUrl(url) {
				let newwin = window.open()
				newwin.document.write("<img src="+ url +" />")
			},
			openUrl(url) {
				// 打开新窗口查看pdf
				if(url === '' || url === null || url === undefined) return
				let str = url.substring(0, url.indexOf('?'))
				let suffix = str.substring(str.lastIndexOf('.'), url.length)
				if(suffix === '.PDF' || suffix === '.pdf') {
					this.$http({
					url: "/api/quick/server/consumer/pdfPreView",
					method: "post",
					params: {
						ossPath: url
					},
					responseType: 'blob'
					}).then((data) => {
					const blob = new Blob([data]);
					const href = window.URL.createObjectURL(blob)
					window.open('/pdfjs/web/viewer.html?file=' + encodeURIComponent(href))
					});
				}else if(suffix === '.txt' || suffix === '.txt') {
					window.open(url);
				} else {
					let newwin = window.open();
					newwin.document.write("<img src=" + url + " />");
				}
			},
			getTaskCount() {
				// 获取任务数量
				this.$http({
					url: '/api/business/selectTaskCountByPlatformId?businessId=' + this.$route.query.id,
					method: 'post',
					headers: {
						'Content-Type': 'application/json'
					}
				}).then(data => {
					if (data.code === 0) {
						this.taskCountObj = data.result
					}
				})
			},
			getSettleNum() {
				// 获取结算单数量
				this.$http({
					url: '/api/business/selectSettleNumByBusinessId?businessId=' + this.$route.query.id,
					method: 'post',
					headers: {
						'Content-Type': 'application/json'
					}
				}).then(data => {
					if (data.code === 0) {
						this.settleCountNum = data.result
					}
				})
			},
			getInvoiceCount() {
				// 获取结算单数量
				this.$http({
					url: '/api/business/selectInvoiceNumByBusinessId?businessId=' + this.$route.query.id,
					method: 'post',
					headers: {
						'Content-Type': 'application/json'
					}
				}).then(data => {
					if (data.code === 0) {
						this.invoiceCountNum = data.result
					}
				})
			}
		}
	};
</script>